<template>
  <view style="background-color: #f0f2f5;height: 100vh;">
    <!-- 用户信息区域 -->
    <view class="user-info">
      <u-avatar :src="userInfo.avatar" size="90"></u-avatar>
      <text class="username">{{ userInfo.username }}</text>
      <text class="bio">{{ userInfo.departmentName }}</text>
    </view>

    <!-- 功能列表 -->
    <view class="menu-list">
      <u-cell-group>
        <!-- #ifdef APP -->
        <u-cell icon="level" title="系统版本" value="随云平台更新" @click="update" :label="version"></u-cell>
        <!-- #endif -->
        <!-- #ifdef H5 -->
        <u-cell icon="level" title="系统版本" value="自动更新" @click="update" :label="version"></u-cell>
        <!-- #endif -->
        <u-cell icon="chat" title="联系我们" @click="chatWe"></u-cell>
        <u-cell icon="more-dot-fill" title="更多功能" value="正在研发中"></u-cell>
      </u-cell-group>

    </view>
    <up-tabbar :value="currentTabbar" @change="name => currentTabbar = name" :fixed="true" :placeholder="true"
      :border="true" :safeAreaInsetBottom="true">
      <up-tabbar-item text="云工作台" icon="arrow-leftward" @click="goback" />
      <up-tabbar-item text="供应链工作台" icon="home" @click="home" />
      <up-tabbar-item :text="userInfo.username" icon="account"></up-tabbar-item>
    </up-tabbar>

    <u-modal :show="modalShow" title="联系我们" @confirm="modalShow = false" confirmText="确定">
      <view class="slot-content">
        <u-text type="primary" text="行政中心-信息管理部-信息化服务部"></u-text>
        <u-text type="warning" text="18795893850(王梦聪)"></u-text>
        <u-text type="warning" text="19033797757(谢磊)"></u-text>
      </view>
    </u-modal>

    <u-modal :show="versionShow" title="版本更新" @confirm="versionShow = false" confirmText="立即更新" showCancelButton
      @cancel="versionShow = false">
      <view class="slot-content">
        <u-text type="primary" text="检测到新版本:V1.1.1"></u-text>
      </view>
    </u-modal>

    <upVersion :upLoadUrl="upLoadUrl" :newVision="newVision" :appStoreUrl='appStoreUrl' :show="show" :log="log"
      @close="close"></upVersion>
  </view>
</template>

<script>
import {
  useLoginStore,
  useUserStore
} from '@/pinia-store/user';
import {
  mapStores
} from 'pinia';
import checkappupdate from '/js_sdk/wonyes-checkappupdate/wonyes/checkappupdate.js';
import upVersion from "@/components/as-upVersion/as-upVersion.vue"
export default {
  components: {
    upVersion
  },
  data () {
    return {
      src: "https://cloud.mfarmers.com/dist/interface/public/upload/avatar/test.jpg",
      userInfo: {
        avatar: 'https://cloud.mfarmers.com/dist/interface/public/upload/avatar/test.jpg', // 用户头像
        username: '', // 用户名
        departmentName: '' // 用户简介
      },
      currentTabbar: 2,
      modalShow: false,
      versionShow: false,
      version: '',
      upLoadUrl: "", // 安卓下载链接
      newVision: "", // 最新版本号
      appStoreUrl: '',// AppStore链接,
      log: '',
      show: false
    }
  },
  methods: {
    goback () {
      uni.redirectTo({
        url: '/pages/workspace/home/index'
      });
    },
    home () {
      uni.redirectTo({
        url: '/pages/supplyChain/home/index?isShow=1'
      });
    },
    update () {
      // checkappupdate.check({})	
      // this.checkVersion();
      // #ifdef APP
      // this.checkVersion();
      // #endif 
    },
    /**
     * 联系我们
     */
    chatWe () {
      this.modalShow = true;
    },

    close () {
      this.show = false;
    },

    /**
     * 获取版本
     */
    checkVersion () {
      var info = uni.getSystemInfoSync();
      uni.request({
        url: 'http://121.229.107.81:81/api/version/getVersion', //仅为示例，并非真实接口地址。。
        data: {
          platform: plus.os.name.toLocaleLowerCase(),
          version: info.appWgtVersion
        },
        header: {
          'content-type': 'application/json'
        },
        method: 'POST',
        dataType: 'json',
        success: (res) => {
          console.info(res)
          //此处调用后端接口返回当前版本号和下载地址
          //回调赋值
          if (res.data.data.code != 0) {
            uni.showToast({
              title: '已经是最新版本',
              duration: 2000
            });
            return;
          }
          this.newVision = res.data.data.version
          this.appStoreUrl = ''
          this.upLoadUrl = res.data.data.url
          this.log = res.data.data.log
          this.show = true
        }
      });
    },
  },
  onLoad (option) {
    var info = uni.getSystemInfoSync();
    // #ifdef APP
    this.version = info.appWgtVersion;
    // #endif
    // #ifdef H5
    this.version = info.appVersion;
    // #endif
    // console.info("版本信息1:",info);
    this.userInfo.username = option.userName;
    this.userInfo.departmentName = option.departmentName;
    if (this.userStore.user.img_url) {
      this.userInfo.avatar = this.userStore.user.img_url;
    } else {
      this.userInfo.avatar = this.src;
    }

  },
  computed: {
    ...mapStores(useLoginStore, useUserStore)
  },
}
</script>

<style>
/* 设置页面背景颜色 */

.container {
  padding: 20px;
}

.user-info {
  padding-top: 20px;
  padding-bottom: 20px;
  background-color: white;
  display: flex;
  flex-direction: column;
  align-items: center;
  margin-bottom: 30px;
  border-bottom: 1px solid #eee;
}

.avatar {
  width: 80px;
  height: 80px;
  border-radius: 50%;
  margin-bottom: 10px;
}

.username {
  font-size: 18px;
  font-weight: bold;
  margin-bottom: 5px;
}

.bio {
  font-size: 14px;
  color: #666;
}

.menu-list {
  background-color: #fff;
  border-radius: 10px;
  overflow: hidden;
}

.menu-item {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 15px;
  border-bottom: 1px solid #eee;
}

.menu-item:last-child {
  border-bottom: none;
}

.arrow {
  width: 20px;
  height: 20px;
}

::v-deep .u-border-top {
  border-top: 1px solid #d9d9d9 !important;
}
</style>